<template>
    <div class="app-container">
      <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
        <el-form-item label="订单编号" prop="relatedOrderId">
          <el-input
            v-model="queryParams.relatedOrderId"
            placeholder="请输入订单编号"
            clearable
            @keyup.enter="handleQuery"
          />
        </el-form-item>
        <el-form-item label="创建时间" prop="createdTime">
          <el-date-picker clearable
            v-model="queryParams.createdTime"
            type="date"
            value-format="YYYY-MM-DD"
            placeholder="请选择创建时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
          <el-button icon="Refresh" @click="resetQuery">重置</el-button>
        </el-form-item>
      </el-form>
  
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="Plus"
            @click="handleAdd"
            v-hasPermi="['logisticsmaster:logisticsmaster:add']"
          >寄件</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="danger"
            plain
            icon="Delete"
            :disabled="multiple"
            @click="handleDelete"
            v-hasPermi="['logisticsmaster:logisticsmaster:remove']"
          >删除</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="warning"
            plain
            icon="Download"
            @click="handleExport"
            v-hasPermi="['logisticsmaster:logisticsmaster:export']"
          >导出</el-button>
        </el-col>
        <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
      </el-row>
  
      <el-table v-loading="loading" :data="logisticsmasterList" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="物流单号" align="center" prop="logisticsId" />
        <el-table-column label="重量(kg)" align="center" prop="orderWeight" />
        <el-table-column label="运费" align="center" prop="price"/>
        <el-table-column label="物流状态" align="center" prop="status" />
        <el-table-column label="创建时间" align="center" prop="createdTime" width="180">
          <template #default="scope">
            <span>{{ parseTime(scope.row.createdTime, '{y}-{m}-{d}') }}</span>
          </template>
        </el-table-column>
        <el-table-column label="更新时间" align="center" prop="updatedTime" width="180">
          <template #default="scope">
            <span>{{ parseTime(scope.row.updatedTime, '{y}-{m}-{d}') }}</span>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
          <template #default="scope">
            <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['logisticsmaster:logisticsmaster:remove']">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      
      <pagination
        v-show="total>0"
        :total="total"
        v-model:page="queryParams.pageNum"
        v-model:limit="queryParams.pageSize"
        @pagination="getList"
      />
  
   <!-- 添加或修改物流订单对话框 -->
  <el-dialog :title="title" v-model="open" width="500px" append-to-body>
    <el-form ref="logisticsmasterRef" :model="form" :rules="rules" label-width="80px">
      <el-form-item label="订单重量">
            <el-input v-model="form. orderWeight" placeholder="请输入订单重量(kg)" />
          </el-form-item>
          <el-form-item label="当前地址">
            <el-input v-model="form. currentLocation" placeholder="请输入当前地址" />
          </el-form-item>
          <el-form-item label="联系人姓名">
            <el-input v-model="form. contactName" placeholder="请输入联系人姓名" />
          </el-form-item>
          <el-form-item label="联系人电话">
            <el-input v-model="form. contactPhone" placeholder="请输入联系人电话" />
          </el-form-item>
          <el-form-item label="配送省份">
            <el-input v-model="form.province" placeholder="请输入省份" />
          </el-form-item>
          <el-form-item label="配送城市">
            <el-input v-model="form.city" placeholder="请输入城市" />
          </el-form-item>
          <el-form-item label="配送区县">
            <el-input v-model="form.district" placeholder="请输入区县" />
          </el-form-item>
          <el-form-item label="配送详细街道地址">
            <el-input v-model="form.detailAddress" placeholder="请输入详细街道地址" />
          </el-form-item>
        </el-form>
        <template #footer>
          <div class="dialog-footer">
            <el-button type="primary" @click="submitForm">确 定</el-button>
            <el-button @click="cancel">取 消</el-button>
          </div>
        </template>
      </el-dialog>
  
     
    </div>
  </template>
  
  <script setup name="Logisticsmaster">
  import { listLogisticsmaster, getLogisticsmaster, delLogisticsmaster, addLogisticsmaster, updateLogisticsmaster } from "@/api/logisticsmaster/logisticsmaster";
  import Cookies from 'js-cookie';
  import {addLogisticsaddress}  from "@/api/logisticsaddress/logisticsaddress";
  
  const { proxy } = getCurrentInstance();
  
  const logisticsmasterList = ref([]);
  const open = ref(false);
  const loading = ref(true);
  const showSearch = ref(true);
  const ids = ref([]);
  const single = ref(true);
  const multiple = ref(true);
  const total = ref(0);
  const title = ref("");
  
  const data = reactive({
    form: {},
    queryParams: {
      pageNum: 1,
      pageSize: 10,
      relatedOrderId: null,
      userName: null,
      orderWeight: null,
      distance: null,
      status: null,
      createdTime: null,
      updatedTime: null
    },
    rules: {
    }
  });
  
  const { queryParams, form, rules } = toRefs(data);
  
  /** 查询物流订单列表 */
  function getList() {
    loading.value = true;
    const userName="sqlstudent";
    queryParams.value.userName=userName;
    listLogisticsmaster(queryParams.value).then(response => {
      logisticsmasterList.value = response.rows;
      // 遍历计算price
  logisticsmasterList.value.forEach(item => {
    item.price = item.orderWeight * 0.1; // 假设weight字段存在
  });
      total.value = response.total;
      loading.value = false;
    });
  }
  
  // 取消按钮
  function cancel() {
    open.value = false;
    reset();
  }
  
  // 表单重置
  function reset() {
    form.value = {
      logisticsId: null,
      relatedOrderId: null,
      orderWeight: null,
      distance: null,
      status: null,
      createdTime: null,
      updatedTime: null
    };
    proxy.resetForm("logisticsmasterRef");
  }
  
  /** 搜索按钮操作 */
  function handleQuery() {
    queryParams.value.pageNum = 1;
    getList();
  }
  
  /** 重置按钮操作 */
  function resetQuery() {
    proxy.resetForm("queryRef");
    handleQuery();
  }
  
  // 多选框选中数据
  function handleSelectionChange(selection) {
    ids.value = selection.map(item => item.logisticsId);
    single.value = selection.length != 1;
    multiple.value = !selection.length;
  }
  
  /** 新增按钮操作 */
  function handleAdd() {
    reset();
    open.value = true;
    title.value = "添加物流订单";
  }
  
  /** 修改按钮操作 */
  function handleUpdate(row) {
    reset();
    const _logisticsId = row.logisticsId || ids.value
    getLogisticsmaster(_logisticsId).then(response => {
      form.value = response.data;
      open.value = true;
      title.value = "修改物流订单";
    });
  }
  
  function generateUniqueOrderId() {
    const timestamp = new Date().getTime(); // 13位时间戳
    const random = Math.floor(Math.random() * 10000); // 4位随机数
    return `${timestamp}${random.toString().padStart(4, '0')}`;
  }
  /**寄件的提交按钮函数 */
  function submitForm() {
    const userName=Cookies.get("username");
    // form.logisticsId=
    form.value.addressType="SENDER";
    console.log(form.value);
    form.value.userName=userName;
    form.value.distance=0;
    form.value.logisticsId = generateUniqueOrderId();
    form.value.relatedOrderId=0;
    form.value.status ="CREATED";
    try{
    addLogisticsmaster(form.value).then(response => {
      
    });
    addLogisticsaddress(form.value).then(response => {
      
    });
    getList();
    proxy.$modal.msgSuccess("寄件成功");
            open.value = false;
  
  }catch(error){
    proxy.$modal.msgError("寄件失败");
    open.value = false;
  }
  finally{
   getList();
  }
  
  }
  
  /** 删除按钮操作 */
  function handleDelete(row) {
    const _logisticsIds = row.logisticsId || ids.value;
    proxy.$modal.confirm('是否确认删除物流订单编号为"' + _logisticsIds + '"的数据项？').then(function() {
      
      return delLogisticsmaster(_logisticsIds);
      getList();
    }).then(() => {
      getList();
      proxy.$modal.msgSuccess("删除成功");
    }).catch(() => {});
  }
  
  /** 导出按钮操作 */
  function handleExport() {
    proxy.download('logisticsmaster/logisticsmaster/export', {
      ...queryParams.value
    }, `logisticsmaster_${new Date().getTime()}.xlsx`)
  }
  
  getList();
  </script>